import React, { Component } from 'react';
import { Switch, Route, Redirect } from 'react-router-dom';
import GlobalNav from '@/components/base/GlobalNav';
import Footer from '@/components/base/Footer';
import HeaderTop from '@/components/mine/mine-base/HeaderTop';
import HeaderNav from '@/components/mine/mine-base/HeaderNav';
import Cook from './child/Cook';
import Cookbook from './child/CookBook';
import Menu from './child/Menu';
import Cooked from './child/Cooked';
import Message from './child/Message';
import Draft from './child/Draft';
import Collection from './child/Collection';
class Com extends Component {
  constructor (props) {
    super(props);
    this.state = {
      list:[
        {
          path: '/mine/cook',
          name: '概况'
        },
        {
          path: '/mine/cookbook',
          name: '菜谱'
        },
        {
          path: '/mine/cookde',
          name: '作品'
        },{
          path: '/mine/menu',
          name: '菜单'
        },
        {
          path: '/mine/message',
          name: '留言板'
        },
        
        {
          path: '/mine/collection',
          name: '收藏'
        },
        {
          path: '/mine/draft',
          name: '草稿箱'
        }
      ]
    }
  }

  render () {
    return (
      <div className = "container">
        <div className="header">
          <GlobalNav {...this.props}/>
         </div>
        <div className="section">
          <HeaderTop />
          <HeaderNav 
          list = { this.state.list }
          />
          <Switch>
            <Route path = "/mine/cook" component = { Cook } />
            <Route path = "/mine/cookbook" component = { Cookbook } />
            <Route path = "/mine/cookde" component = { Cooked } />
            <Route path = "/mine/menu" component = { Menu } />
            <Route path = "/mine/message" component = { Message } />
            <Route path = "/mine/draft" component = { Draft } />
            <Route path = "/mine/collection" component = { Collection } />
            <Redirect from = "/mine" to = "/mine/cook"/>
          </Switch>
        </div>
        <div className="foot">
          <Footer />
        </div>
      </div>
    )
  }
}

export default Com;
